const path = require("path");
const { VueLoaderPlugin } = require("vue-loader");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin')
const distPath = "lib";

module.exports = {
    mode: "production",
    target: "web",
    devtool: false,
    entry: {
        "vue-async-dialog": "./src/index.js",
    },
    output: {
        clean: true,
        path: path.join(__dirname, distPath),
        filename: `[name].js`,
        globalObject: "self",
        library: {
            name: "VueAsyncDialog",
            type: "umd",
        },
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: "vue-loader",
            },
            {
                test: /\.css$/,
                use: [MiniCssExtractPlugin.loader, "css-loader"],
            },
            {
                test: /\.(scss|sass)$/,
                use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"],
            },
            {
                test: /\.(js|jsx)$/,
                use: ["babel-loader"],
                exclude: /node_modules/,
            },
        ],
    },
    plugins: [
        new VueLoaderPlugin(),
        new MiniCssExtractPlugin({
            filename: "styles.css",
            ignoreOrder: true,
        }),
        new CssMinimizerPlugin(),
        new CopyWebpackPlugin({
            patterns: [
                // { from: './package.json' },
                { from: './README.md' }
            ],
        }),
    ],
    externalsType: "umd",
    externals: {
        vue: "Vue",
        "element-ui": "ElementUI",
        'eventemitter3': 'eventemitter3'
    },
};
